<template>
  <div id="radarBox" ref="radarBox" style="width: 600px;height: 400px;">雷达图</div>
</template>
<script>
import * as ECharts from 'echarts'
import radarData from './radarData'

export default {
  name: 'RadarEcharts',
  mounted() {
    // 实例化echarts对象
    // const echarts = ECharts.init(this.$refs.radarBox)
    this.echarts = ECharts.init(this.$refs.radarBox)
    // 设置配置
    this.echarts.setOption(radarData)
    // 请求网络数据
    this.initData()
  },
  methods: {
    // 获取图表数据
    initData() {
      // 模拟ajax
      setTimeout(() => {
        const value1 = [4200, 3000, 20000, 35000, 50000, 18000]
        const value2 = [5000, 14000, 28000, 26000, 42000, 21000]
        // 处理数据
        radarData.series[0].data[0].value = value1
        radarData.series[0].data[1].value = value2
        // 重新绘制
        this.echarts.setOption(radarData)
      }, 2500)
    }
  }
}
</script>

<style scoped>

</style>
